qx.Class.define("lastfmbackup.view.Tab", {
  
  extend    : qx.core.Object,
  implement : lastfmbackup.view.IElement,
    
  events : {

    /**
     *  Fired when the backup is opened
     */
    appear : "qx.event.type.Event"
    
  },
  
  construct : function()
  {
    this.base(arguments);
    
    this._anchor = q(".tertiaryNavigation ul")
      .append("<li><a href='/settings/backup/'>Backup</a></li>")
      .find("a:last")
      .on("click", this._onClickTab, this);
      
    this._element = q.create("<div/>");
  },
  
  members : {
    
    _anchor  : null,
    _element : null,
    
    
    _onClickTab : function(event)
    {
      var parent = this._anchor.getParents("li").eq(0);
      if(parent.hasClass("current"))
      {
        return;
      }
      
      parent.getSiblings().removeClass("current");
      parent.addClass("current");
     
      q(".tertiaryNavigation")
        .getNextAll().hide()
        .getParents().eq(0).append(this._element);
      
      this.fireEvent("appear");
        
      event.preventDefault();
    },
    
    getElement : function()
    {
      return this._element;
    }
    
  }
  
});